<template>
  <view class="my-repair-list">
    <view class="list-header">
      <view class="list-header-left">问卷题目</view>
      <view class="list-header-right">发布时间</view>
    </view>
    <view class="repair-list">
      <view
        class="list-content"
        v-for="(item, index) in quesName"
        :key="index"
        @click="servicePageTo(item.q_id,item.q_name)"
      >
        <view class="list-content-left">
          <view class="list-content-icon"
            ><text class="iconfont icon-dian icon-dian"></text>
          </view>
          <view class="list-left">
            <view class="list-type">{{ item.q_name }}</view>
            <!-- <view class="list-date">{{ item.time }}</view> -->
          </view>
        </view>
        <view class="list-content-right">{{ item.date }} </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      show: true,
      quesName: [],
    };
  },
  onShow() {
    this.$MyRequest({
      url: "/ques-name-list",
    }).then((res) => {
      console.log(res);
      this.quesName = res.data.data.sort((a, b) => {
        return a.id < b.id ? 1 : -1;
      });
    });
  },
  methods: {
    servicePageTo(q_id,q_header) {
      // uni.navigateTo({
      //   url: "/pages/home/service/QuestionNaire/QuestionFrom/",
      // });
      uni.navigateTo({
        url: "/pages/home/service/QuestionNaire/QuestionFrom?q_id=" + q_id+"&q_header="+q_header,
      });
      // console.log(url);
    },
  },
};
</script>

<style lang="scss">
@import "@/static/styles/mixin.scss";
.my-repair-list {
  width: 100%;
  height: 100vh;
  background-color: $uni-color-indexBg;

  .list-header {
    display: flex;
    background-color: $uni-color-indexBg;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 10rpx 20rpx;
  }
  .repair-list {
    width: 100%;
    padding: 0 20rpx;
    box-sizing: border-box;
    background-color: #fff;
    padding-bottom: 20rpx;
    .list-content {
      background-color: #fff;
      // padding: 0 20rpx;
      border-bottom: 1rpx solid rgb(223, 223, 223);
      height: 50px;
      display: flex;
      justify-content: space-between;

      .list-content-left {
        @include center;
        .list-left {
          @include center;
          font-size: 16px;
        }
        .list-content-icon {
          @include center;
        }
        .icon-dian {
          color: $uni-color-error;
          padding-top: 2px;
          font-size: 16px;
          @include center;
        }
      }
      .list-content-right {
        @include center;
        color: $uni-color-warning;
      }
    }
    // .list-content :last-child {
    //   padding-bottom: 10rpx;
    // }
  }
  .repair-list :last-child {
    // padding-bottom: 30rpx;
  }
}
</style>
